// 导出router-view组件配置对象
export default {
    name: 'router-view',
    render (h) {
        // 标记当前组件为routerView
        this.$vnode.data.routerView = true
        
        // component存放当前路由对应的组件
        let component = null
        // 当前router-view组件的深度
        let depth = 0
        let parent = this.$parent
        
        // 向上遍历是否还存在router-view组件，得到当前router-view的深度
        while(parent) {
            if (parent.$vnode.data && parent.$vnode.data.routerView) {
                depth++
            }  
            parent = parent.$parent
        }
        
        // 取出匹配路由的组件
        const matched = this.$router.matched[depth]
        component = matched && matched.component
        
        
        // 因为currentPath是响应式数据，在当前组件的render方法中使用该属性后，当currentPath改变，render会重新执行
        // 根据$router上的currentPath的变化，动态匹配组件
        // const {routeMap, currentPath} = this.$router
        // component = routeMap[currentPath] ? routeMap[currentPath].component : null
        
        return h(component)
    }
}